/**
 * 文件名: src/app/page.tsx
 * 
 * 文件概述:
 * 应用主页组件，作为页面入口点渲染核心布局，并初始化应用数据。
 * 
 * 依赖项:
 * - ../components/AppLayout: 应用主布局组件
 * - 'use client': 声明为客户端组件(仅用于初始化store)
 * 
 * 组件结构:
 * - Home: () => JSX.Element
 *   - <StoreInitializer />: 初始化store(可选组件)
 *   - <AppLayout />: 主布局组件
 * 
 * 主要功能:
 * 1. 导入并渲染AppLayout组件
 * 2. 初始化应用数据(通过useEffect或特定组件)
 * 
 * 数据初始化:
 * - 如使用StoreInitializer组件:
 *   ```
 *   'use client';
 *   import { useEffect } from 'react';
 *   import { useAppStore } from '../store';
 *   
 *   const StoreInitializer = () => {
 *     useEffect(() => {
 *       useAppStore.getState().init();
 *     }, []);
 *     return null;
 *   };
 *   ```
 * 
 * 注意事项:
 * - 仅在需要初始化store时使用'use client'
 * - 保持组件简洁，专注于布局渲染和数据初始化
 * - 初始化时处理可能的错误
 */

'use client';

import { useEffect } from 'react';
import AppLayout from '../components/AppLayout';
import { useAppStore } from '../store';

// 初始化Store的客户端组件
const StoreInitializer = () => {
  const { init, setError } = useAppStore();
  
  useEffect(() => {
    // 初始化应用数据
    const initializeApp = async () => {
      try {
        await init();
      } catch (error) {
        // 处理初始化错误
        setError(error instanceof Error ? error.message : '初始化过程中发生错误');
        console.error('初始化失败:', error);
      }
    };
    
    initializeApp();
  }, [init, setError]);
  
  return null;
};

// 主页组件
export default function Home() {
  return (
    <>
      {/* 初始化Store */}
      <StoreInitializer />
      
      {/* 渲染主布局 */}
      <AppLayout />
    </>
  );
}
